<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="icon.css">
    <title>Иконки</title>
</head>
<!-- Частая ситуация: на странице нужно показать иконки соцсетей со ссылками на аккаунты. -->
<body>
    <div class="wrapper">
        <ul class="social">
          <li class="social__item twitter">
            <a href="" class="social__link"></a>
          </li>
          <li class="social__item fb">
            <a href="" class="social__link"></a>
          </li>
          <li class="social__item youtube">
            <a href="" class="social__link"></a>
          </li>
        </ul>
    </div>
<!-- </body>
Обратите внимание, что внутри ссылок ничего не написано. 
Нам не нужно выводить название соцсети, а нужно вывести иконку с логотипом. Что мы и сделаем при помощи фона. -->

  